<template>
	<div>
		<section class="top-nav" >
			首页
		</section>
		<section >
			<mu-carousel style="height: 22rem;" >
			  <mu-carousel-item >
				<img src="http://e.hiphotos.baidu.com/image/pic/item/3b292df5e0fe9925a8a324c539a85edf8cb171f3.jpg">
			  </mu-carousel-item>
			  <mu-carousel-item >
				<img   src="http://e.hiphotos.baidu.com/image/pic/item/3b292df5e0fe9925a8a324c539a85edf8cb171f3.jpg">
			  </mu-carousel-item >
			  <mu-carousel-item >
				<img   src="http://e.hiphotos.baidu.com/image/pic/item/3b292df5e0fe9925a8a324c539a85edf8cb171f3.jpg">
			  </mu-carousel-item>
			  <mu-carousel-item >
				<img   src="http://e.hiphotos.baidu.com/image/pic/item/3b292df5e0fe9925a8a324c539a85edf8cb171f3.jpg">
			  </mu-carousel-item>
			</mu-carousel>
		</section>

				
						
			
			
			
			<section style="text-align: left;color: #9b9b9b;height: 4rem;font-size: 1rem;line-height: 4rem;">
				功能模块
			</section>
			<section class="btn-container" style="display: flex;flex-direction: row;">
				<section class="btn-index" @click="gotoAddress({path:'factoryList'})">
					<mu-icon :size="28" value="list" color="#3ea1ec" />
					<span style="color: #bbbbbb;">我的工厂</span>
				</section>
				<section class="btn-index">
					<mu-icon :size="28" value="directions_bus" color="#3ea1ec" />
					<span style="color: #bbbbbb;">敬请期待</span>
				</section>
				<br/>
				
				<!--<section class="btn-index" @click="gotoAddress({path:'orderList'})" >
					<mu-icon :size="28" value="local_shipping" color="#3ea1ec" />
					<span style="color: #bbbbbb;">销售订单</span>
				</section>
				<section class="btn-index">
					<mu-icon :size="28" value="list" color="#3ea1ec" />
					<span style="color: #bbbbbb;">销售车辆</span>
				</section>-->
			</section>		
			<section class="btn-container" style="display: flex;flex-direction: row;margin-top: 0.4rem;">
				<section class="btn-index"  @click="cancel()">
					<mu-icon :size="28" value="local_shipping" color="#3ea1ec" />
					<span style="color: #bbbbbb;">注销</span>
				</section>
				<section class="btn-index">
				</section>
			</section>		
			<section style="text-align: left;color: #9b9b9b;height: 2rem;font-size: 0.7rem;line-height: 4rem;">
				
				
				<span style="flex: 0.1;">身份码:</span><label>{{openid}}</label>
				<!--<label v-model="openid"></label>-->
				<mu-button class="mu-btn" type="button" v-clipboard:copy="openid" v-clipboard:success="onCopy" v-clipboard:error="onError">复制</mu-button>
			</section>
			
			<section style="text-align: left;color: #9b9b9b;height: 2rem;font-size: 0.5rem;line-height: 4rem;">
				
				
				<span style="flex: 0.1;">版本号:</span><label>{{version}}</label>
			</section>
	</div>
</template>

<script>


	export default{
		data(){
			return{
				openid:'',
				version:'',
			}
		},
		mounted(){
			//this.getVersion()
			//获取版本号注释
		     this.version=window.localStorage.version
			this.getOpenid()
		},
		methods:{
			
			onCopy:function(e){
				this.$toast.success('复制身份码成功');

			},
			
			onError:function(e){
				this.$toast.error('复制失败');
			},
//			getVersion(){
//				this.version = window.localStorage.version
//			},
			getOpenid(){
				
				this.openid = localStorage.userNumber
				//this.openid =this.GLOBAL.openid

			},
			gotoAddress(path){
				var self=this
				setTimeout(function(){
					self.$router.push(path)
				},200)
			},
			cancel(){
				
				let that=this
				this.$confirm('请确认是否注销?', '提示', {
          			confirmButtonText: '注销',
          			cancelButtonText: '取消',
          			center:true,
          			type: 'warning'
        		}).then(() => {
	      				console.info('注销了')
	      				that.axios.post('/Login/logout',{

	      				}).then(function(response){
							that.gotoAddress('login2')
							that.$message({type: 'success',message: '注销成功!',duration:1500})

	      				}).catch(function(error){
	      			 		console.log(error)
	      			 		that.gotoAddress('login2')
							that.$message({type: 'success',message: '注销成功!',duration:1500})
	      				})
					
        			}).catch(() => {
        				//that.gotoAddress('login2')
					});
			}
		}
	}
</script>

<style scoped>
.mu-btn{
	width: 3.6rem;
	height: 1.4rem;
	background: #f6f6f6;
	color: #bbbbbb;
	font-size: 0.8rem;
	min-width: 3rem;
}	
.btn-container .btn-index:nth-child(1){
	border-right:0.2rem solid white;
}
.btn-container .btn-index:nth-child(2),.btn-container .btn-index:nth-child(3){
	border-left:0.2rem solid white ;
	border-right:0.2rem solid white;
}
.btn-container .btn-index:nth-child(4){
	border-left:0.2rem solid white;
}
.btn-index{
	background: #f6f6f6;
	height: 5.6rem;
	flex: 1;
	display: flex;
	flex-direction: column;
	justify-content: center;
	align-items: center;
}
.top-nav{
	top: 0;
	left: 0; 
	height: 3rem;
	background: white;
	border-bottom: 1px solid #e5e5e5;
	display: flex;
	justify-content: center;
	align-items: center;
	font-size: 1.2rem;
	color: #7a7a7a;
	border-bottom:1px solid #e5e5e5 ;
}

</style>